
<template>
	<!-- 添加每日菜品 -->
	<div>
		<el-row :gutter="16">
			<el-col :span="4">
				<span class="formLable must">考勤日期</span>
			</el-col>
			<el-col :span="10">
				<el-date-picker
					v-model="saveParam.date"
					type="date"
					placeholder="选择日期"
					@change="selectDateChange">
				</el-date-picker>
			</el-col>
		</el-row>
		<el-row :gutter="16">
			<el-col :span="4">
				<span class="formLable must">考勤班级</span>
			</el-col>
			<el-col :span="5">
				<el-select v-model="saveParam.grade" placeholder="请选择年级">
					<el-option label="一年级" value="1"></el-option>
					<el-option label="二年级" value="2"></el-option>
				</el-select>
			</el-col>
			<el-col :span="5">
				<el-select v-model="saveParam.class" placeholder="请选择班级">
					<el-option label="1班" value="1"></el-option>
					<el-option label="2班" value="2"></el-option>
				</el-select>
			</el-col>
		</el-row>
		<el-row v-if="saveParam.class">
			<el-row>
				<el-col :span="5">
					<span class="formLable must">消耗课时/天/次</span>
				</el-col>
				<el-col :span="5">
					<span class="formLable">1</span>
				</el-col>
			</el-row>
			<el-row>
				<span class="formLable">班级学员</span>
			</el-row>
			<el-row>
				<table class="table" cellspacing="0" style="width: 100%;">
					<thead class="thead">
						<tr>
							<td style="width: 10%;">序号</td>
							<td style="width: 20%;">姓名</td>
							<td style="width: 20%;">监护人</td>
							<td style="width: 30%;">联系电话</td>
							<td style="width: 20%;">考勤</td>
						</tr>
					</thead>
					<tbody class="tbody">
						<tr v-for="(item,index) in tableList" :key="index">
							<td></td>
							<td></td>
							<td></td>
							<td></td>
							<td>
								<el-select v-model="item.signMode">
									<el-option label="签到" value="1"></el-option>
									<el-option label="请假" value="2"></el-option>
								</el-select>
							</td>
						</tr>
					</tbody>
				</table>
			</el-row>
			<el-row style="text-align:center;">
				<el-button @click="cancle">取消</el-button>
				<el-button @click="save">提交</el-button>
			</el-row>
		</el-row>
		
	</div>
</template>

<script>
	let vm;
	export default{
		components:{},
		data(){
			return {
				saveParam:{
					date:'',
					grade:'',
					class:'',
				},
				tableList:[],

			}
		},
		methods:{
			init(data){
				
				if(data){
					
				}
			},
			cancle(){
				this.$emit('cancle',false);
			},
			save(){
				
				this.$emit('cancle',false);
			},
			selectDateChange(val){
				if(!val){
					this.saveParam.grade='';
					this.saveParam.class='';
				}
			},
		},
		mounted(){
			vm=this;
		},
		computed:{
			
		},
		watch:{

		}
	}
</script>

<style lang="scss" scoped>
	.formLable,.formValue{
		font-size: 0.16rem;
		line-height: 0.4rem;
	}
	.formLable.must::before{
		content: '*';
		color: red;
		margin: 0 0.05rem;
	}
	.el-row{
		margin-bottom: 0.16rem;
	}
	.el-checkbox{
		font-size: 0.16rem;
		line-height: 0.4rem;
	}
	.el-radio{
		font-size: 0.16rem;
		line-height: 0.4rem;
	}
</style>
<style scoped src="@/style/module/table.css"></style>